extends /_layout/default.pug

block scripts
  // Plugins and scripts required by this view
  script(src='js/popovers.js')

block view
  .fade-in
    .card
      .card-header
        |  Popovers
        .card-header-actions
          a.card-header-action(href='http://coreui.io/docs/components/bootstrap-popover/popovers.html', target='_blank')
            small.text-muted docs
      .card-body
        button.btn.btn-lg.btn-danger(type='button', data-toggle='popover', title='Popover title', data-content="And here's some amazing content. It's very engaging. Right?")
          | Click to toggle popover
        hr
        a.btn.btn-lg.btn-danger(tabindex='0', role='button', data-toggle='popover', data-trigger='focus', title='Dismissible popover', data-content="And here's some amazing content. It's very engaging. Right?")
          | Dismissible
          | popover
    .card
      .card-header
        |  Popovers
        small directions
      .card-body
        button.btn.btn-secondary(type='button', data-container='body', data-toggle='popover', data-placement='top', data-content='Vivamus sagittis lacus vel augue laoreet rutrum faucibus.')
          | Popover on top
        button.btn.btn-secondary(type='button', data-container='body', data-toggle='popover', data-placement='right', data-content='Vivamus sagittis lacus vel augue laoreet rutrum faucibus.')
          | Popover on right
        button.btn.btn-secondary(type='button', data-container='body', data-toggle='popover', data-placement='bottom', data-content='Vivamus sagittis lacus vel augue laoreet rutrum faucibus.')
          | Popover on bottom
        button.btn.btn-secondary(type='button', data-container='body', data-toggle='popover', data-placement='left', data-content='Vivamus sagittis lacus vel augue laoreet rutrum faucibus.')
          | Popover on left
